<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
		<meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-control" content="no-cache,no-store,must-revalidate">
    <meta http-equiv="Cache" content="no-cache">
    <title>制造部管理</title>
    <link rel="stylesheet" href="../../component/pear/css/pear.css" />
    <link rel="stylesheet" href="../../admin/css/other/department.css" />
  </head>
  <body class="pear-container">
    <div class="layui-row layui-col-space10">
      <div class="layui-col-md6 layui-col-md-offset3">
        <div class="layui-card">
          <div class="layui-card-body">
            <table id="topdept-table" lay-filter="topdept-table"></table>
          </div>
        </div>

        <!-- <div class="layui-card">
          <div class="layui-card-body">
            <table
              id="organization-table"
              lay-filter="organization-table"
            ></table>
          </div>
        </div> -->
      </div>
    </div>

    <script type="text/html" id="my-toolbar">
      <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="addTopDept">
        <i class="layui-icon layui-icon-add-1"></i>
        新增
      </button>

    </script>

    <script type="text/html" id="my-row-toolbar">
      <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit">
        <i class="layui-icon layui-icon-edit"></i>
      </button>
      <button class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove">
        <i class="layui-icon layui-icon-delete"></i>
      </button>
    </script>

    <script type="text/html" id="topdept-enabled">
      <input id="enabled" type="checkbox" name="topdept-enabled"
      value="{{d.enabled}}" lay-skin="switch" lay-text="启用|禁用" {{
      d.enabled==true ? 'checked' : '' }}/>
    </script>

    <script src="../../component/layui/layui.js"></script>
    <script src="../../component/pear/pear.js"></script>
    <script>
      // 加载自定义模块,检查浏览器和token
      layui.extend({
        myheader: "{/}/lay-ext/myheader",
      });
      layui.use(
        ["table", "form", "jquery", "myheader", "popup", "layer"],
        function () {
          let table = layui.table;
          let form = layui.form;
          let $ = layui.jquery;
          let myheader = layui.myheader;
          let popup = layui.popup;
          let layer = layui.layer;

          // 定义全局 ajax的请求头
          myheader.ajaxGlobal(myheader.checkToken().tokenValue);
          
          // 定义常量
          const baseUrl = myheader.baseUrl();
          const MODULE_PATH = "operate/";
          const mypage = {};

          // 列参数
          let topdeptCols = [
            [
              { type: "numbers" },
              { title: "制造部名称", field: "topDeptName"},
              {
                title: "是否可用",
                field: "enabled",
                templet: "#topdept-enabled",
                event: "setEnabled",
                width:100
              },
              { title: "操作", toolbar: "#my-row-toolbar", align: "center", width:110 },
            ],
          ];

          // 渲染表格
          const tableIdx = table.render({
            elem: "#topdept-table",
            // 请求
            url: baseUrl + "/topDept/findAll",
            cols: topdeptCols,

            response: {
              // 重新设定返回的数据格式
              statusCode: 200, //默认返回 code:0 为返回成功,改成200
              countName: "total", //默认数组总量字段是count,改成total
            },
            // 样式
            skin: "line",
            //分页
            page: true, // 分页
            // 工具
            // 头部左侧工具栏使用模板
            toolbar: "#my-toolbar",
            // 头部右侧工具栏
            defaultToolbar: [
              {
                title: "刷新",
                layEvent: "refresh",
                icon: "layui-icon-refresh",
              },
              // "filter",
              // "exports",
              // "print",
            ],
          });

          // 工具栏
          table.on("toolbar(topdept-table)", function (obj) {
            const layEvent = obj.event;
            if (layEvent === "refresh") {
              table.reloadData("topdept-table", {
                scrollPos: "fixed", // 保持滚动条位置不变 - v2.7.3 新增
              });
            } else if(layEvent==='addTopDept') {
              mypage.addTopDept()
            }
          });

          // 行 事件
          table.on("tool(topdept-table)", function (obj) {
            let layEvent = obj.event; // 当前事件

            if (layEvent === "setEnabled") {
              // 改变行的enabled值
              mypage.setEnabled(obj);
            } else if (layEvent === "remove") {
              // 删除行
              mypage.delLine(obj);
            } else if (layEvent === "edit") {
              mypage.edit(obj);
            } 
          });


          // 改变enabled值 函数
          mypage.setEnabled = function (obj) {
            let data = obj.data; //行数据
  
            layer.confirm("确定".concat(data.enabled ? "禁用" : "启用", "吗?"),
              {
                btn:['确定','取消'],
                cancel:function(){
                  obj.update({
                    enabled: data.enabled,
                  });
                }
              },
              // 确认时的回调
              function (layerIdx) {
                $.ajax(baseUrl + "/topDept/uptEnabled", {
                  async: false, //同步方法
                  type: "post",
                  data: {
                    departmentID: data.topDeptID,
                    enabled: !data.enabled,
                  },
                  success: function (data) {
                    let res = data.data;
                    if (res === 1) {
                      obj.update({
                        enabled: !data.enabled,
                      });
                      layer.msg("已保存", { time: 1500 });
                    } else {
                      layer.alert("变更失败", { icon: 2 });
                    }
                  },
                  complete: function () {
                    // ajax 采用同步请求,所以在最后重载数据
                    table.reloadData("topdept-table", {
                      scrollPos: "fixed", // 保持滚动条位置不变 - v2.7.3 新增
                    });
                    layer.close(layerIdx); //关闭确认框
                  },
                });
              },
              // 取消时的回调
              function () {
                obj.update({
                  enabled: data.enabled,
                });
              }
            );
          };
          // 删除行 函数
          mypage.delLine = function (obj) {
            let data = obj.data;
            layer.confirm("确定删除吗?", function (layerIdx) {
              $.ajax(baseUrl + "/topDept/delTopDept", {
                async: false, //同步方法
                type: "post",
                data: {
                  // topDeptName: data.topDeptName,
                  departmentID: data.topDeptID,
                },
                success: function (data) {
                  let res = data.data;
                  if (res === 1) {
                    obj.del();
                    layer.msg("已删除", { time: 1500 });
                  } else {
                    layer.msg("删除失败", { time: 1500 });
                  }

                },
                complete: function () {
                  table.reloadData('topdept-table',{
                    scrollPos: 'fixed'  // 保持滚动条位置不变 - v2.7.3 新增
                  })
                  layer.close(layerIdx); //关闭确认框
                },
              });
            });
          };
          // 编辑行数据 函数
          mypage.edit = function (obj) {
            layui.sessionData("fu2zi", {
              key:"fuData",
              value:obj.data   //行数据
            })
            layer.open({
              type: 2,
              title: "修改",
              shade: 0.1,
              area: ["auto", "400px"],
              content: MODULE_PATH + "topdept-edit.html",
              
            });
          };
         
          // 新增部门 函数
          mypage.addTopDept = function(){
            layer.open({
              type: 2,
              title: "新增制造部",
              shade: 0.3,
              area: ["auto", "200px"],
              content: MODULE_PATH + "topdept-add.html",
            });
          }

        }
      );
    </script>
  </body>
</html>
